<?php
$cs = Yii::app()->clientScript;
$cs->registerCoreScript('jquery.ui');
$cs->registerCoreScript('bbq');
$cs->registerCoreScript('cookie');
$cs->registerScriptFile(Yii::app()->theme->baseUrl . '/scripts/jquery.ui.nestedSortable.js');
$cs->registerScriptFile(Yii::app()->theme->baseUrl . '/scripts/json2.js');
$script = "
var timer = null;
jQuery('#list-container').nestedSortable({
    disableNesting: 'no-nest',
    forcePlaceholderSize: true,
    handle: '.sort-handle',
    items: '.sortable',
    opacity: .6,
    placeholder: 'placeholder',
    tabSize: 25,
    tolerance: 'pointer',
    toleranceElement: '> table',
    'listType' : 'ul',
    update: function(event, ui){
        jQuery('#list-container').nestedSortable('disable');
        var serialized = jQuery('#list-container').nestedSortable('serialize');
        jQuery('.ordering-updated').remove();
        if (timer) {
            clearTimeout(timer);
            timer = null;
        }
        jQuery.get('" . $this->sortButtonUrl . "', serialized, function(res){
            jQuery('#list-container').nestedSortable('enable');
        });
    }
});
";
$cs->registerScript(__CLASS__ . '#InitNestedSortable', $script);
$script = "
jQuery('.status-column a').click(function(){
    var _this = jQuery(this);
    var href = jQuery(this).attr('href');
    jQuery.get(href, function(res){
        if (_this.hasClass('active'))
            _this.removeClass('active');
        else
            _this.addClass('active');
    });
    return false;
});
jQuery('.actions-column a.delete').click(function(){
    var _this = jQuery(this);
    if (!confirm('Are you sure you want to delete this item?'))
        return false;
    jQuery.get(jQuery(this).attr('href'), function(res){
        if (_this.closest('li.sortable').find('.sortable').size())
            window.location = window.location.href.replace(/\#.*/, '');
        else
            _this.closest('li.sortable').remove();
    });
    return false;
});
jQuery('.check-all').click(function(){
    if (jQuery(this).attr('checked'))
        jQuery('.checkbox-column input').attr('checked', true);
    else
        jQuery('.checkbox-column input').attr('checked', false);
});
jQuery('.checkbox-column input').click(function(){
    if (!jQuery(this).attr('checked'))
        jQuery('.check-all').attr('checked', false);
});
";
$cs->registerScript(__CLASS__ . '#Actions', $script);

$script = "
var toggle = jQuery.cookie('toggle') || {};
if (typeof toggle === 'string')
{
    var tmp = {};
    JSON.parse(toggle, function(key,value){
        tmp[key] = value;
        key = key.replace('_','-');
        if (value == 0)
        {
            $('#'+key+' > .items .collapse').addClass('expand');
            $('#'+key+' > ul').hide();
        }
    });
    toggle = tmp;
}
jQuery('.sort-handle .expand, .sort-handle .collapse').click(function(){
    var id = jQuery(this).closest('.sortable').attr('id').replace('-','_');
    if (jQuery(this).hasClass('expand'))
    {
        jQuery(this).removeClass('expand')
            .closest('.items').next('ul').show();
        toggle[id] = 1;
    }
    else
    {
        jQuery(this).addClass('expand')
            .closest('.items').next('ul').hide();
        toggle[id] = 0;
    }
    
    jQuery.cookie('toggle', JSON.stringify(toggle));
    return false;
});
";
$cs->registerScript(__CLASS__ . '#Toggle', $script);
?>
<style type="text/css">
    .grid-view ul {
        padding: 0;
        display: block;
        margin: 0;
    }

    .grid-view ul li {
        list-style: none;
    }

    .grid-view .sort-handle {
        cursor: move;
    }

    .grid-view table.items {
        border-bottom: 1px solid #FFFFFF;
    }

    #list-container ul {
        padding-left: 20px;
    }

    .ordering-updated {
        background: url(<?php echo Yii::app()->theme->baseUrl;?>/images/notifications.gif) 10px center #EEEEEE no-repeat;
        padding: 5px 0 5px 30px;
        margin: 10px 0;
    }

    .placeholder {
        background: #DBDBDB;
        border-bottom: 1px solid #FFFFFF;
    }
</style>

<div class="grid-view">
    <table class="items">
        <thead>
        <tr>
            <th align="center"
                width="20"><?php echo CHtml::checkBox('check_all', false, array('class' => 'check-all'));?></th>
            <th align="left">Category Name</th>
            <th style="width: 25px;">Visible</th>
            <th width="100">Action</th>
        </tr>
        </thead>
    </table>
    <?php if (count($data)): ?>
    <ul id="list-container">
        <?php $this->renderNested($data);?>
    </ul>
    <?php else: ?>
    <table class="items">
        <tr class="odd">
            <td colspan="4"><?php echo Yii::t('zii', 'No results found.');?></td>
        </tr>
    </table>
    <?php endif;?>
</div>
